var loadingDiv = '<div id="loadingDiv" class="ui-state-highlight"><em>LOADING...</em></div>';
var loadingOption = "<option value=''>Loading...</option>";

var view = function(viewName) {
	return $("#"+viewName+"Container");
}

var route = function(userArgs) {
	var args = {
		control: "",		// this is control we are listening to, must be a valid jQuery selector
		event: "click",		// this is the event we are listening for
		com: {				// controller call details
			name: "",		// if the name is blank (default) no call is made
			args: { }
		},
		view: {
			target: "",	// a container (for view updates), must be a valid jQuery selector
			name: "",		// if the name is blank (default) no call is made
			args: { }
		},
		success: function() {	// callback which fires after completion of everything 
		},
		error: function() {
			alert("router error");
		}
	}
	
	$.extend(args, userArgs);

	$(args.control).bind(args.trigger.event, function() {
		eval("app.com." + args.com.name + "(" + comArgStr + ")");
		view(args.view.target).display(args.view.name, args.view.args);
		args.success();
	});
}